<!DOCTYPE html>
<html>
<head>
    <title>全部活动</title>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">

    <meta name="description" content="">

    <link rel="stylesheet" href="dist/lib/weui.css">
    <link rel="stylesheet" href="dist/css/build.css">
    <link rel="stylesheet" href="dist/css/jquery-weui.css">

    <style>
        body {
            background: #f5f5f5
        }

        .weui-cells.weui-cells_form {
            background: #fff;
            /*-moz-box-shadow: 2px 2px 5px #333333;*/
            /*-webkit-box-shadow: 0px 2px 15px #eee;*/
            /*box-shadow: 0px 2px 15px #eee;*/
            /*border-bottom: 1px solid #EDEDED;*/
        }

        .weui-media-box_appmsg {
            align-items: normal;
        }

        .weui-media-box__bd span {
            color: #aaa;
            font-size: 14px;
        }

        .weui-media-box_appmsg .weui-media-box__hd {
            background: #417DFF;
            border-radius: 3px;
            overflow: hidden;
        }

        .weui-media-box_appmsg .weui-media-box__hd img {
            width: 100%;
            height: 100%;
        }

        .weui-media-box_appmsg .weui-media-box__hd:after {
            content: '活动';
            color: #fff;
        }

        .hide {
            display: none;
        }

        .weui-loadmore_line .weui-loadmore__tips {
            background: #f5f5f5;
        }
    </style>
</head>

<body>

<div class="page__bd">

    <!--Vue 模板内容 开始-->
    <div class="weui-panel weui-panel_access" id="list">

        <div class="weui-panel__bd" id="orderlist">

            <div v-for="item in items" class="weui-media-box weui-media-box_appmsg"
                 @click="openDetails(item.id,item.title)">

                <div class="weui-media-box__hd" v-if=" item.photoFrontConverUrl == null ">
                </div>

                <div class="weui-media-box__hd" v-else>
                    <img class="weui-media-box__thumb" :src="item.photoFrontConverUrl" alt="">
                </div>

                <div class="weui-media-box__bd">
                    <h4 class="weui-media-box__title">{{item.title}}</h4>
                    <p class="weui-media-box__desc">{{item.comment}}</p>
                    <span>{{dateUtils.beautify_time(item.publishDate)}}</span>
                </div>
            </div>

        </div>
    </div>
    <!--Vue 模板内容 结束-->

</div>

<div class="weui-loadmore hide" id="jz">
    <i class="weui-loading"></i>
    <span class="weui-loadmore__tips">正在加载</span>
</div>

<script src="dist/lib/jquery-2.1.4.js"></script>
<script src="dist/lib/fastclick.js"></script>
<script>
    $(function () {
        FastClick.attach(document.body);
    });

</script>
<script src="dist/js/jquery-weui.js"></script>
<script src="dist/lib/vue.min.js"></script>
<script src="dist/lib/http.js"></script>
<script src="dist/lib/jquery.cookie.js"></script>


<script>
    $http.getUserSignIn(true, 'activity_list.html');
    console.log($http.getUserSignIn());

    /**
     上拉加载
     */
    var rs = {
        id: '',
        roles: ''
    };
    var ListID = '';
    var loading = false;
    $(document.body).infinite().on("infinite", function () {
        if (loading) return;
        // if (ListID == 1) return;
        loading = true;
        if (ListID < 0) {
            return $(".page__bd").append(
                "<div style='text-align: center; margin-top: 5px; margin-bottom: 10px; color: #666666; font-size: 14px; padding: 10px'>没有更多了</div>"
            )
        }
        $(document.getElementById('jz')).removeClass('hide');
        getData(ListID);
        setTimeout(function () {
            // getData(id);
            $(document.getElementById('jz')).addClass('hide');
            loading = false;
        }, 2000);
    });

    //vue 模板替换
    var news = new Vue({
        el: '#orderlist',
        data: {
            items: [] //列表信息流数据
        }
    });

    /**
     * 获取列表数据
     * @param id=null
     */
    function getData(id = null) {

        rs['id'] = id || 0;
        rs['roles'] = '';

        $http.post($http.getFindByIdOnWeChat(rs['id'], '')).then(function (data) {
            // var obj = JSON.parseJSON(data);
            // var data =JSON.stringify(data);
            if (data.success == true) {
                news.items = news.items.concat(data['data']);

                /**
                 * 获取最后的数组id
                 */
                var pageId = data['data'].slice(-1);
                if (pageId[0]['id'] > 0) {
                    ListID = pageId[0]['id'];//得到页码
                    console.log(ListID);
                }

            } else {
                if (rs['id'] != 0) {
                    return ListID = -1;
                } else {
                    return $(".page__bd").append(
                        '<div class="weui-loadmore weui-loadmore_line"><span class="weui-loadmore__tips">暂无数据</span></div>'
                    )
                }
            }
        }, function (err) {
            console.log(err);
            return err;
        });
    }

    getData();

    /**
     * 打开详情
     * @param id
     * @param title
     */
    function openDetails(id, title) {
        $.cookie('activity', $http.getCookieArray(id, title));
        window.location.href = 'activity_details.html?id=' + id + '&title=' + title;
        // window.location.href = 'activity_details.html';
    }
</script>
</body>
</html>
